<template>
	<div class="add-jq-dialog">
		<!--添加仓库-->
		
		
		<appdialog 
			ref="dialog"
			:visible="false" 
			title="添加仓库"
			width="30%"
			@confirm="confirmAdd"
			@cancle="cancleAdd"
			>
			
			<el-form 
				ref="addForm" 
				:rules="rules" 
				:model="addForm"
				label-width="100px"
				
				>
			
				<el-form-item label="仓库地址：" prop="clusterType">
					<!--仓库的地址-->
					<nameInput @change="clusterType" ref="dizhi"
						></nameInput>
				</el-form-item>
				
				<el-form-item label="仓库名称：" prop="clusterName">
					<!--仓库名称-->
					<nameInput @change="changeName" ref="name"
						></nameInput>
				</el-form-item>
				
				<el-form-item label="备注：">
					<!--备注-->
					<appTextarea @change="changeDESC" ref="beizhu"></appTextarea>
				</el-form-item>
				
			</el-form>
			
			
		</appdialog>
		
		
		
	</div>
</template>

<script>

import appdialog from "@/view/components/dialog/dialog";
import huanjingStatusSelect from "@/view/components/select/huanjingStatusSelect";
import nameInput from "@/view/components/input/nameInput";
import appTextarea from "@/view/components/textarea/textArea";

import {save} from "@/service/swagger/ResourceClusterController"

export default {
	name: "addJQDialog",
	components: {
		appdialog,
		huanjingStatusSelect,
		nameInput,
		appTextarea
	},
	data() {
    return {
      addForm : {
      	clusterType : "",
      	clusterName : "",
      },
      rules : {
      	clusterType: [
          { required: true, message: '请输入仓库地址', trigger: 'blur' },
        ],
      	clusterName: [
          { required: true, message: '请输入仓管名称', trigger: 'blur' },
        ],
      }
    }
  },
  mounted() {
  	
  },
	methods:{
   	open(){
   		this.$refs.dialog.open();
		 },
		//  表单重置
   	initFrom(){
			setTimeout(()=>{
				for(let i in this.$refs){
					let ref = this.$refs[i]
					if(ref.reset){
						ref.reset();
					}
				}
			},90)
		},
		close(){
			this.initFrom();
			this.$refs.dialog.close();
		},
   	confirmAdd(){
   		console.log("确认添加" , this.addForm )
   		
   		// 验证表单
   		this.$refs.addForm.validate((valid) => {
        if (valid) {
        	// 验证通过
          this.submitAdd();
        } else {
        	setTimeout(()=>{
        		this.open();
        	},50)
          
          return false;
        }
      });
   		// 
   	},
   	submitAdd(){
   		save({...this.addForm}).then(ret=>{
				if(ret&&ret.code == 0){
						this.$message({message: '创建成功',type: 'success',duration : 2000,});
						this.close()
						this.$emit("addSucess")
				}else{
            this.close()
				}
   		})
   	},
   	cancleAdd(){
   		
   	},
   	
   	clusterType(name,v){
   		console.log("地址改变：",name,v)
   		this.addForm.clusterType = v ;
   	},
   	changeName(name,v){
   		console.log("name改变：",name,v)
   		this.addForm.clusterName = v ;
   	},
   	changeDESC(name,v){
   		console.log("备注改变：",name,v)
   		
   	}
   	
   	
	}
}
</script>

<style scoped lang="scss">
@import "../../../styles/variables.scss";


</style>